<html>
	<head>
		<title>Graduation Projects</title>
		<link href="css/bootstrap.min.css" rel="stylesheet">
		<style>
			.top-buffer { margin-top:50px; }
			.item { height: 140px; width:45%; margin-left: 3%;}
			.img-thumbnail-height { height: 130px;}
			.img-thumbnail-height img { height: 100%;}
			#img1{
				width:100px;
				height:80px;
			}
			div #th{
				width:800px;
				height:150px;
				position:relative;
				left:130px;
			}
			div #p{
				width:950px;
				position:relative;
				left:80px;
			}
		</style>
		<script src="js/jquery-1.4.min.js"></script>
		<link href="css/dep_proj_color_blue.css" rel="stylesheet">
	</head>
	<body>
		<div class="container top-buffer">
			<div class="panel panel-default" id='p'>
				<div class="panel-body">
					<form role="form" class="form-horizontal" id="search">
						<div class = "row" >
							<label for="track" class="col-xs-1" id='l1'>Track</label>
							<div class="col-xs-4">
								<select name="track" id="track" class="form-control">
									<option value="1" id='o1'>Open Source Applications Developer</option>
									<option value="4" id='o2'>Telecom Applications Developer</option>
								</select>
							</div>
					
							<label for="track" class="col-xs-1" id='l2'>Intake</label>
							<div class="col-xs-2">
								<select name="intake" id="intake" class="form-control">
									<option value="33"  >33</option>
									<option value="34"  >34</option>
								</select>
							</div>
								<img src="images/1.jpeg" alt="Graduate Image" id='img1' />
							<div class="col-xs-2">
								
							</div>
						</div>
					</form>
				</div>
			</div>
			<div id="students-container">
				<div class="thumbnail item pull-left" id='th'>
					<div class="pull-left col-xs-5 img-thumbnail-height">
						<img src="images/220px-Opensource.svg_.png" alt="Graduate Image" class="img-circle" />
					</div>
					<h3 id='h31'><a href='Projectname.html' id='a1'>Project Name</a></h3>
					<span id='s11'>Open Source - intake Intake33</span><br/></br>
					<span id='s12'>tags:<a href='#' >PHP</a>,<a href='#' >MYSQL</a></span>
				</div>
				<div class="thumbnail item pull-left" id='th'>
					<div class="pull-left col-xs-5 img-thumbnail-height" >
						<img src="images/Android_Open_Source_Project.png" alt="Graduate Image" class="img-circle" />
					</div>
					<h3 id='h32'><a href='Projectname.html' id='a1'>Project Name</a></h3>
					<span id='s21'>Open Source - intake Intake33</span><br/></br>
					<span id='s22'>tags:<a href='#' >PHP</a>,<a href='#' >MYSQL</a>,<a href='#' >JavaScript</a></span>
				</div>
				<div class="thumbnail item pull-left" id='th'>
					<div class="pull-left col-xs-5 img-thumbnail-height" >
						<img src="images/packt.png" alt="Graduate Image" class="img-circle" />
					</div>
					<h3 id='h33'><a href='Projectname.html' id='a1'>Project Name</a></h3>
					<span id='s31'>Open Source - intake Intake33</span><br/></br>
					<span id='s32'>tags:<a href='#' >C++</a>,<a href='#' >Java</a></span>
				</div>
				<div class="thumbnail item pull-left" id='th'>
					<div class="pull-left col-xs-5 img-thumbnail-height" >
						<img src="images/Open-Source-Software-For-Windows.jpg" alt="Graduate Image" class="img-circle" />
					</div>
					<h3 id='h34'><a href='Projectname.html' id='a1'>Project Name</a></h3>
					<span id='s41'>Open Source - intake Intake33</span><br/></br>
					<span id='s42'>tags:<a href='#' >PHP</a>,<a href='#' >HTML5</a>,<a href='#' >CSS</a></span>
				</div>
		
			</div>
			<div style="clear:both" >
			<div class="text-center" >
				<ul class="pagination ">
					<li><a href="#">&laquo;</a></li>
					<li><a href="#">1</a></li>
					<li><a href="#">2</a></li>
					<li><a href="#">3</a></li>
					<li><a href="#">4</a></li>
					<li><a href="#">5</a></li>
					<li><a href="#">&raquo;</a></li>
				</ul>
			</div>
		</div>
	</body>
	<script src='js/chang.js'></script>
</html>
